<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sb" uri="/struts-bootstrap-tags" %>
<%@ include file="/page/user/gerenHeader.jsp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><s:property value="company.comName"/>|饿9定</title>
<script src="<%=basePath %>js/jquery-2.0.3.min.js" type="text/javascript"></script>
<style type="text/css">
#nav1 ul{
list-style: none;
}
#nav1 ul li{
float: left;
padding-left: 10px;
}
#nav ul{ 
margin: 0 0 0 10px; 
padding-top:8px;
font-size: 16px; 
color: black; 
line-height: 30px; 
white-space: nowrap; 
margin-left: -40px;
margin-top: 20px;
} 
#nav li{ 
list-style-type: none; 
display: inline; 
} 
#nav li a { 
text-decoration: none; 
font-family: '微软雅黑';
font-size:16px; 
padding: 10px 20px; 
color: black; 
} 
#nav li a:hover { 
color: black; 
background-color: #3199e8; 
} 
#nav li a:VISITED { 
color: black; 
background-color: #3199e8; 
} 
#menu ul li a:LINK{text-decoration: none;color:black;}
#menu ul li  a:visited {text-decoration:none ; color:#0089e0;}
#menu ul li  a:hover {text-decoration:underline ; color:#0089e0;}
#menu ul li  a:active {text-decoration:none ; color:#0089e0;} 
#mycart tr td{
/*  border: 1px red solid;  */
 font-family: '微软雅黑';
}
</style>
<script type="text/javascript">
function addCart(mId){
	var postData={menuId:mId,userId:$("#user").val()};
	//alert(postData.menuId);
	$.ajax({
		type:'post',
        url:'cart_addMenu',
        data:postData,
        dataType:'json',
        success:function(data){
           /*  alert(111);
            alert(data.msg); */
        	getCarts();
            }
		});
}
function getCarts(){
	var postData={userId:$("#user").val()};
	//alert(postData);
	$.ajax({
		type:'post',
        url:'cart_getCarts',
        data:postData,
        dataType:'json',
        success:function(data){
      // alert(data.length)
      var num=0;
      var sum=0;
      var tab='<table>';
      for(var i=0;i<data.length;i++){
                  num+=data[i].menuNum;
                  sum+=data[i].menuNum*data[i].menuPrice;
                  tab+='<tr height="30px"><td width="100px">'+data[i].menuName+'</td><td style="display:none" class="pronum" >'+data[i].menuNum+'<td><td width="100px"><input type="button" value="-" class="min" style="width: 20px;height: 20px;margin-left:15px;"/><input type="text" value="'+data[i].menuNum+'" class="text_box" style="width: 20px;height: 15px"/><input type="button" class="add" value="+" style="width: 20px;height: 20px"/></td><td width="90px" align="center">'+data[i].menuPrice+'</td></tr>';
           }
      tab+='</table>';
      var div='<div style="width: 40px;height: 40px;float: left"><img alt="" width="38px" height="40px;" src="<%=basePath%>image/cart.png"> </div><div style="width: 170px;height:35px;color:#999;background-color: #2c2c2c;margin-top:5px;float: left;font-size: 15px;">';
      div+='<div style="width: 40px;height:35px;float: left;" id="pnum"><s:property value=""/>'+num+'份</div>';
      div+='<div style="width: 50px;height:35px;float: left;" id="money"><s:property value=""/>'+sum+'元</div>';
      div+='</div><div style="width: 70px;height: 25px;color:black;background-color: #e4e4e4;margin-top:5px;float: right;"><input type="button" style="background-color: #fdda33;width: 70px;height: 40px;font-family: "微软雅黑";font-size: 15px;" value="去买单>" /></div>';
      document.getElementById("Mycart").innerHTML=div;
      document.getElementById("mycart").innerHTML=tab;
      }
	});
}
</script>
<sb:head/>
</head>
<body style="background-color: #e4e4e4;">
<s:hidden value="%{company.comId}" id="comId"></s:hidden>
<s:hidden value="%{#session.user.userId}" id="user"></s:hidden>
<div style="background-color:white;width:100%;height: 100px;border-bottom: #e4e4e4 1px solid; ">
<div style="width:1100px;height:100% ;margin-left:115px;">
<div style="width: 350px;height:100% ;float: left;">
<table>
<tr height="50px;">
<td width="100px;" rowspan="2"><img width="100px" height="100px;" alt="" src="<%=basePath%>image/<s:property value='company.comImage'/>"> </td>
<td width="250px;"><span style="font-size:20px;"><s:property value="company.comName"/></span> </td>
</tr>
<tr height="50px;">
<td width="250px;"><img src="<%=basePath%>image/start/start<s:property value="company.avgEval"/>.png"/>&nbsp;<span style="font-family:微软雅黑';font-size:10px;color:#e4e4e4;"><s:property value="company.comtypeName"/></span> </td>
</tr>
</table>
</div>
<div style="width: 380px;height:100% ;float: left;" id="nav">
<ul>
<li><a href="menu_menuList?comId=<s:property value="company.comId"/>">菜单</a></li>
<li><a>美食墙</a></li>
<li><a href="eval_evalList?comId=<s:property value="company.comId"/>">评价</a></li>
</ul>
</div>
<div style="width: 350px;height:100% ;float: right;">
<table>
<tr height="70px">
<td width="120px;" align="center"><span style="font-family:'微软雅黑';font-size:40px;font-weight:200;color:#333;"><s:property value="company.roomDate"/></span></td>
<td width="120px" align="center"><span style="font-family:'微软雅黑';font-size:40px;font-weight:200;color:#333;">1</span></td>
<td width="100px" align="center"><span style="font-family:'微软雅黑';font-size:40px;font-weight:200;color:#333;"><s:property value="company.comDis"/></span></td>
</tr>
<tr height="20px">
<td width="120px" align="center">速度/分钟</td>
<td width="120px" align="center">餐厅距离/千米</td>
<td width="100px" align="center">起送价/元</td>
</tr>

</table>
</div>
</div>
</div>
<div style="background-color:white;width: 1100px;height: 1800px;margin:15px auto; ">
<div style="width:800px;height: 100%; float:left;">
<div style="width:100%;height: 50px;" id="menu">
<ul style="list-style: none;font-size: 14px;margin-top: 15px;">
<li style="float:left;text-align:center;color:#0089e0;">默认排序</li>
<li style="float:left;text-align:center;padding-left: 30px;"><a href="javascript:void(0)" onclick="userComSort('total_num')">销量</a></li>
<li style="float:left;text-align:center;padding-left: 30px;"><a href="javascript:void(0)" onclick="userComSort('avg_eval')">评价</a></li>
<li style="float:left;text-align:center;padding-left: 30px;"><a href="javascript:void(0)" onclick="userComSort('room_date')">价格</a></li>
</ul>
</div>
<div style="width:100%;height: 1740px;" id="list">
<%-- <table>
<tr height="300px">
<td width="280px">
<table style="padding-top: 20px;padding-left: 20px;" >
<tr height="175px;">
<td width="150px" colspan="2"><img alt="" width="230px;" height="175px" src=""> </td>
</tr>
<tr height="30px">
<td width="150px" align="left">azz</td>
<td width="80px" align="right"><a href="javascript:void(0);"  title="加入菜篮" onclick="menu_addCart()"><img alt="" width="27px" height="27px;" src="<%=basePath%>image/addcart.png"> </a> </td>
</tr>
<tr height="30px">
<td width="150px" align="left"></td>
<td width="80px" align="right"><span style="margin-top:10px;">￥12/每份</span></td>
</tr>
<tr height="30px">
<td width="150px"align="left"></td>
<td width="80px"></td>
</tr>
</table>
</td>
<td width="280px">
<table style="padding-top: 20px;padding-left: 20px;">
<tr height="175px;">
<td width="150px" colspan="2"></td>
</tr>
<tr height="30px">
<td width="150px"></td>
<td width="80px"></td>
</tr>
<tr height="30px">
<td width="150px"></td>
<td width="80px"></td>
</tr>
<tr height="30px">
<td width="150px"></td>
<td width="80px"></td>
</tr>
</table>
</td>
<td width="280px">
<table style="padding-top: 20px;padding-left: 20px;">
<tr height="175px;">
<td width="150px" colspan="2"></td>
</tr>
<tr height="30px">
<td width="150px"></td>
<td width="80px"></td>
</tr>
<tr height="30px">
<td width="150px"></td>
<td width="80px"></td>
</tr>
<tr height="30px">
<td width="150px"></td>
<td width="80px"></td>
</tr>
</table>
</td>
</tr>
</table> --%>
</div>
<script type="text/javascript">
var postData={comId:$("#comId").val()};
userMenuList();
function userMenuList(){
	$.ajax({
           type:'post',
           url:'menu_getMenus',
           data:postData,
           dataType:'json',
           success:function(data){
          // alert(data.list.length);
               var tab="<table>";
               for(var i=0;i<data.list.length;i=i+3){
                    tab+='<tr height="300px">';
                    tab+='<td width="280px">';
                    tab+='<table style="padding-top: 20px;padding-left: 20px;" ><tr height="175px;">';
                    tab+='<td width="150px" colspan="2"><img alt="" width="230px;" height="175px" src="<%=basePath%>upload/'+data.list[i].menuImage+'"></td>';
                    tab+='</tr><tr height="30px">';
                    tab+='<td width="150px" align="left"><span>'+data.list[i].menuName+'</span></td>';
                    tab+='<td width="80px" align="right"><a href="javascript:void(0);"  title="加入菜篮" onclick="addCart(\''+data.list[i].menuId+'\')"><img alt="" width="27px" height="27px;" src="<%=basePath%>image/addcart.png"></a></td>';
                    tab+='</tr><tr height="30px">';
                    tab+='<td width="150px" align="left"><img alt="" width="30px;" height="30px" src="<%=basePath%>image/start/start'+data.list[i].avgEval+'.png"/></td>';
                    tab+='<td width="80px" align="right"><span style="margin-top:10px;">￥'+data.list[i].menuPrice+'/每份</span></td>';
                    tab+='</tr><tr height="30px">';
                    tab+='<td width="150px"align="left"><span>月售</span>'+data.list[i].totalNum+' </td>';
                    tab+='</tr></table></td>';
                    if(i+1<data.list.length){
                    tab+='<td width="280px">';
                    tab+='<table style="padding-top: 20px;padding-left: 20px;" ><tr height="175px;">';
                    tab+='<td width="150px" colspan="2"><img alt="" width="230px;" height="175px" src="<%=basePath%>upload/'+data.list[i+1].menuImage+'"></td>';
                    tab+='</tr><tr height="30px">';
                    tab+='<td width="150px" align="left"><span>'+data.list[i+1].menuName+'</span></td>';
                    tab+='<td width="80px" align="right"><a href="javascript:void(0);"  title="加入菜篮" onclick="addCart(\''+data.list[i+1].menuId+'\')"><img alt="" width="27px" height="27px;" src="<%=basePath%>image/addcart.png"></a></td>';
                    tab+='</tr><tr height="30px">';
                    tab+='<td width="150px" align="left"><img alt="" width="30px;" height="30px" src="<%=basePath%>image/start/start'+data.list[i+1].avgEval+'.png"/></td>';
                    tab+='<td width="80px" align="right"><span style="margin-top:10px;">￥'+data.list[i+1].menuPrice+'/每份</span></td>';
                    tab+='</tr><tr height="30px">';
                    tab+='<td width="150px"align="left"><span>月售</span>'+data.list[i+1].totalNum+' </td>';
                    tab+='</tr></table></td>';
                    }
                    if(i+2<data.list.length){
                    tab+='<td width="280px">';
                    tab+='<table style="padding-top: 20px;padding-left: 20px;" ><tr height="175px;">';
                    tab+='<td width="150px" colspan="2"><img alt="" width="230px;" height="175px" src="<%=basePath%>upload/'+data.list[i+2].menuImage+'"></td>';
                    tab+='</tr><tr height="30px">';
                    tab+='<td width="150px" align="left"><span>'+data.list[i+2].menuName+'</span></td>';
                    tab+='<td width="80px" align="right"><a href="javascript:void(0);"  title="加入菜篮" onclick="addCart(\''+data.list[i+2].menuId+'\')"><img alt="" width="27px" height="27px;" src="<%=basePath%>image/addcart.png"></a></td>';
                    tab+='</tr><tr height="30px">';
                    tab+='<td width="150px" align="left"><img alt="" width="30px;" height="30px" src="<%=basePath%>image/start/start'+data.list[i+2].avgEval+'.png"/></td>';
                    tab+='<td width="80px" align="right"><span style="margin-top:10px;">￥'+data.list[i+2].menuPrice+'/每份</span></td>';
                    tab+='</tr><tr height="30px">';
                    tab+='<td width="150px"align="left"><span>月售</span>'+data.list[i+2].totalNum+' </td>';
                    tab+='<td width="80px"></td></tr></table></td>';
                    }
                    tab+='</tr>';
                       }
               tab+='</table>';
               document.getElementById("list").innerHTML="";
               $("#list").append(tab);
               }
		});
}

</script>
</div>
<div style="width:280px;height: 100%; float:right;" >
<div style="width:280px;height:30px;padding-top:10px; ;background-color: #ff6000;color: white;font-family: '微软雅黑'">餐厅公告</div>
<div style="width:280px;height:230px;padding-top:10px; ;color: #ff6000;font-family: '微软雅黑';border-bottom:#a9a9a9 1px solid;"><s:property value="company.content"/> </div>
<div style="width:280px;height:40px;padding-top:15px; ;color: #0089e0;font-family: '微软雅黑';border-bottom:#a9a9a9 1px solid;">起送价(<s:property value="company.comDis"/>)元，免费配送</div>
<div style="width:280px;height:30px;padding-top:10px; ;color: #0089e0;font-family: '微软雅黑';border-bottom:#a9a9a9 5px solid;border-top: #a9a9a9 5px solid">本周热卖</div>
<div style="width:280px;height:300px;padding-top:15px; ;color: #0089e0;font-family: '微软雅黑';border-bottom:#a9a9a9 1px solid;">
<s:iterator value="%{menuList}" id="menu">
<div style="width:280px;height:40px;padding-top:15px; ;color: #0089e0;font-family: '微软雅黑';border-bottom:#a9a9a9 1px solid;">
<div style="width: 100px;height: 100%;float: left"><s:property value="#menu.menuName"/> </div>
<div style="width: 100px;height: 100%;float: left">￥<s:property value="#menu.menuPrice"/>/每份</div>
<div style="width: 80px;height: 100%;float: left"><a href="javascript:void(0);"  title="加入菜篮" onclick="addCart('<s:property value="#menu.menuId"/>')"><img alt="" width="27px" height="27px;" style="margin-left: 50px;" src="<%=basePath%>image/addcart.png"></a></div>
</div>
</s:iterator>
</div>
<div style="width:280px;height:200px;padding-top:15px; ;color: #0089e0;font-family: '微软雅黑';border-bottom:#a9a9a9 1px solid;"><img alt="" width="280px" height="200px" src="<%=basePath%>image/ditu.png"> </div>
</div>
</div>
<div id="mycart" style="width: 290px;;position:fixed;bottom:40px;right:125px;display: none;background: white;font-family: '微软雅黑';">
<s:if test="%{foodCarts.size()==0}">
<div style="padding-top:20px;padding-bottom: 10px;">菜篮子是空的</div>
</s:if>
<s:else>
<table>
<s:iterator value="foodCarts" id="cart">
<tr height="30px"><td width="90px"><s:property value="#cart.menuName"/></td><td style="display:none" class="pronum" ><s:property value="#cart.menuNum"/></td><td width="90px"><input type="button" value="-" class="min" style="width: 20px;height: 20px;margin-left:15px;"/><input type="text" value="<s:property value="#cart.menuNum"/>" class="text_box" style="width: 20px;height: 15px"/><input type="button" class="add" value="+" style="width: 20px;height: 20px"/></td><td width="80px" align="center"><s:property value="#cart.menuPrice"/></td><td><a title="删除" href="javascript:void(0)" onclick="delFood(<s:property value="#cart.cartId"/>)"><i class="icon-remove"></i></a> </td></tr>
</s:iterator>
</table>
</s:else>
</div>
<div style="width: 290px;height: 40px;position:fixed;bottom:0px;right:125px;background: #2c2c2c;color:white;font-family: '微软雅黑';" onclick="Mycart()" id="Mycart">
<div style="width: 40px;height: 40px;float: left"><img alt="" width="38px" height="40px;" src="<%=basePath%>image/cart.png"> </div>
<s:if test="%{foodCarts.size()==0}">
<div style="width: 100px;height: 25px;color:black;background-color: #e4e4e4;margin-top:5px;;padding-top: 6px;padding-right: 10px;float: right;">篮子是空的哦</div>
</s:if>
<s:else>
<div style="width: 170px;height:35px;color:#999;background-color: #2c2c2c;margin-top:5px;float: left;font-size: 15px;">
<div style="width: 40px;height:35px;float: left;" id="pnum"><s:property value=""/> </div>
<div style="width: 50px;height:35px;float: left;" id="money"><s:property value=""/></div>
</div>
<div style="width: 70px;height: 25px;color:black;background-color: #e4e4e4;margin-top:5px;float: right;"><input type="button" onclick="CartOrder()" style="background-color: #fdda33;width: 70px;height: 40px;font-family: '微软雅黑';font-size: 15px;" value="去买单>" /></div>
</s:else>
<script type="text/javascript">
$(function () {
		$(".add", this).bind("click", function() {
			var t = $(this).parents("tr").find(".text_box");
			t.val(parseInt(t.val()) + 1)
			var changenum = $(this).parents("tr").find(".text_box").val();
		$(this).parents("tr").find(".pronum").text(changenum);
		var sum=0;
		var num1=0;
		var trs=document.getElementsByTagName("tr");
        //alert(trs.length);
		for(var i=0;i<trs.length;i++){
			var num=trs[i].childNodes[1].innerHTML;
		//	alert(num);
			var price=trs[i].childNodes[5].innerHTML;
			//alert(price);
			num1+=parseInt(num);
			sum+=parseFloat(price)*parseInt(num);
		}
		
		document.getElementById("pnum").innerHTML=num1;
		document.getElementById("money").innerHTML =sum; 
		})
		$(".min", this).bind("click", function() {
			var t = $(this).parents("tr").find(".text_box");
			if(t.val()>0){
				t.val(parseInt(t.val()) - 1)
				var changenum = $(this).parents("tr").find(".text_box").val();
				$(this).parents("tr").find(".pronum").text(changenum);
				var sum=0;
				var num1=0;
				var trs=document.getElementsByTagName("tr");
				for(var i=0;i<trs.length;i++){
					var num=trs[i].childNodes[1].innerHTML;
					var price=trs[i].childNodes[6].innerHTML;
					num1+=parseInt(num);
					sum+=parseFloat(price)*parseInt(num);
				}
				document.getElementById("pnum").innerHTML=num1;
				document.getElementById("money").innerHTML =sum; 
			}
		})
	})
function CartOrder(){
	var comId=$("#comId").val();
	var userId=$("#user").val();
	window.location.href="cart_cartOrder?userId="+userId+"&comId="+comId+"";
}
</script>
</div>
<script type="text/javascript">
function Mycart(){
	var display=$("#mycart").css("display");
	//alert(display);
	if(display=="none"){
		$("#mycart").show();
		}
	if(display=="block"){
		$("#mycart").hide();
		}
	
}
</script>
</body>
<%@ include file="/page/user/userFooter.jsp"%>
</html>